<template>
    <article>
        <header>复选框</header>
        <section>
            <header>颜色</header>
            <div>
                <cv-check v-model="checked" c="check default medium distant">普通复选框</cv-check>
                <cv-check v-model="checkedTristate" c="check primary medium distant" tristate>主要复选框</cv-check>
                <cv-check c="check success medium distant">成功复选框</cv-check>
                <cv-check c="check warn medium distant">警告复选框</cv-check>
                <cv-check c="check error medium distant">危险复选框</cv-check>
            </div>
        </section>
        <section>
            <header>大小</header>
            <div>
                <cv-check c="check primary large distant">大复选框</cv-check>
                <cv-check c="check primary medium distant">中复选框</cv-check>
                <cv-check c="check primary small distant">小复选框</cv-check>
                <cv-check c="check primary mini distant">迷你复选框</cv-check>
            </div>
        </section>
    </article>
</template>

<script>
    export default {
        name: "Examplecheck",
        data() {
            return {
                checked: false,
                checkedTristate: 0
            };
        }
    }
</script>

<style scoped>
</style>
